import { Store } from "../../core";

import StoreProps from "./StoreProps";
import useCurrentPage from "./useCurrentPage";
import useNumberOfPages from "./useNumberOfPages";
import { FC, ReactElement } from "react";

interface RenderCurrentPageLabelProps {
  currentPage: number;
  numberOfPages: number;
}

type RenderCurrentPageLabel = (
  props: RenderCurrentPageLabelProps
) => ReactElement;

export interface CurrentPageLabelProps {
  children?: RenderCurrentPageLabel;
}

const CurrentPageLabel: FC<{
  children?: RenderCurrentPageLabel;
  store: Store<StoreProps>;
}> = ({ children, store }) => {
  const { currentPage } = useCurrentPage(store);
  const { numberOfPages } = useNumberOfPages(store);

  const defaultChildren = (props: RenderCurrentPageLabelProps) => (
    <>{props.currentPage + 1}</>
  );

  const render = children || defaultChildren;
  return render({
    currentPage,
    numberOfPages,
  });
};

export default CurrentPageLabel;
